<template>
	<div style="overflow: hidden; position: relative">
		<div style="height: 30vh">
			<el-image
				:src="getFile.getAssetsFile('img', '页脚.png')"
				fit="fill"
			></el-image>
		</div>
		<div
			style="
				position: absolute;
				top: 0;
				bottom: 0;
				width: 100vw;
				height: 30vh;
				background: linear-gradient(
					to top,
					rgba(255, 255, 255, 0.5),
					rgba(255, 255, 255, 1)
				);
			"
			id="img-cover"
		></div>
	</div>
</template>

<script setup>
import getFile from '../utils/getAssetsFile';
</script>

<style scoped>
#img-cover::after {
	position: absolute;
	content: 'Amadeus';
	bottom: 2vh;
	left: 2vw;
	font-size: 20px;
	font-weight: bold;
	color: tomato;
}
</style>
